$(function () {
  // 获取元素
  let userForm = document.querySelector('#userForm');
  let user_name = document.querySelector('input[name=username]');
  let user_title = document.querySelector('input[name=nickname]');
  let user_email = document.querySelector('input[name=email]');
  let user_id = document.querySelector('input[name=id]')
  let btnReset = document.querySelector('#btnReset');

  // 表单验证规则[\u4E00-\u9FA5]
  let form = layui.form;
  form.verify({
    username: [
      /^[a-zA-Z0-9_\u4E00-\u9FA5]{1,6}$/,
      '用户昵称是1~6位的字母，数字，下划线，减号，中文'
    ]
  })
  // 获取用户的基本信息
  function getUsers() {
    $.ajax({
      method: 'GET',
      url: "/my/userinfo",
      success: function (res) {
        if (res.code !== 0) {
          return layer.msg(res.message)
        }
        // console.log(res.data);
        // 给表单整体赋值
        form.val('formUser', res.data)
      }
    });
  }
  getUsers();


  // 点击提交修改 == 监听表单提交事件
  userForm.addEventListener('submit', function (e) {
    e.preventDefault();
    // 发起ajax请求，更新用户信息
    $.ajax({
      method: 'PUT',
      url: "/my/userinfo",
      data: {  //写$(this).serialize()也可以
        id: user_id.value,
        nickname: user_title.value,
        email: user_email.value,
      },
      success: function (res) {
        if (res.code !== 0) {
          return layer.msg(res.message);
        }
        layer.msg(res.message)
        // window.parent.getUser();  //调用index.js里的方法
        window.parent.getUser();
        // 注意：window相当于iframe，
        // 子页面调用父页面里的函数要用window.parent.函数名()
      }
    });
  })
  // 点击重置按钮
  btnReset.addEventListener('click', function (e) {
    e.preventDefault();
    getUsers(); //重新获取用户基本信息
    // console.log(btnReset);
  })

})